<template>
	<div class="toast">
		<p v-html="toastText"></p>
		<span>2s关闭</span>
	</div>
</template>

<script>
	export default {
		props:['toastText'],
		mounted() {
			setTimeout(()=>{
				this.$emit('toastHide',false)
			},1000)
		}
	}
</script>

<style>
	.toast{
		position:fixed;
		padding:10px 30px 15px;
		box-shadow: 1px 1px 4px rgba(0,0,0,0.4);
		border-radius: 5px;
		font-size:0.9rem;
		background:#fff;
		color:#fff;
		left:50%;
		top:50%;
		transform: translate(-50%,-50%);
		z-index:1000;
	}
	.toast p{
		color:#000;
		font-size:16px;
	}
	.toast p i{
		display: block;
		color:seagreen;
		text-align: center;
		font-size:60px;
		margin-bottom:10px;
	}
	.toast span{
		display: block;
		font-size:12px;
		color:#999;
		text-align: center;
		padding-top:5px;
	}
</style>